<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="UTF-8"%>
<%@ page import="org.qiuqiu.pojo.User"  %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%
	String error1;
	String error2;
	error1 = (String)session.getAttribute("error1");
	error2 = (String)session.getAttribute("error2");
	if(error1==null){
		error1="";
	}
	if(error2==null){
		error2="";
	}
 %>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>欢迎登陆</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/public.js"></script>
<script type="text/javascript" src="js/thickbox.js"></script>
<link rel="stylesheet" href="css/thickbox.css" type="text/css" media="screen" />
<script type="text/javascript">
	var booleanArray = [false,false,false];
	function checkButton(index,bo){
		booleanArray[index] = bo;
		if(bo){
			var flag;
			for(var i=0;i<booleanArray.length;i++){
				if(!booleanArray[i]){
					return;
				}
			}
			document.getElementById("submit").disabled=false;
		}else{
			document.getElementById("submit").disabled=true;	
		}
	}
	
	function checkname(){
		var username = trim($("#userName").val());
		if(username.length>0){
			checkButton(0,true);
			$("#error1").html("&nbsp;");
		}else{
			checkButton(0,false);
			$("#error1").attr("color","red");
			$("#error1").html("<img src=\"images/check_error.gif\"/>&nbsp;请输入您用户名");
		}
	}
	function checkpassword(){
		var password = trim($("#password").val());
		if(password.length>0){
			checkButton(1,true);
			$("#error2").html("&nbsp;");
		}else{
			checkButton(1,false);
			$("#error2").attr("color","red");
			$("#error2").html("<img src=\"images/check_error.gif\"/>&nbsp;请输入您的密码");
		}
	}
	function reloadImage(){
    	var img = $("#pic");
		var num= Math.random()*100;
    	img.attr("src","code.jsp?"+num);
		check();
 	}
 	
 	var timeoutId2;
	function check(){
		var inputcode = $("#checkcode").val();
		clearTimeout(timeoutId2);
       	timeoutId2 = setTimeout(function(){
			$.post(
					"checkCode",{inputCode:inputcode},function(data){
						var res = data;
						if(res=="true"){
							checkButton(2,true);
							$("#error3").attr("color","green");
							$("#error3").html("<img src=\"images/check_right.gif\"/>验证码输入正确");
						}else{
							checkButton(2,false);
							$("#error3").attr("color","red");
							$("#error3").html("<img src=\"images/check_error.gif\"/>&nbsp;验证码输入错误");
						}
			},"text")
		},500);
	}
 	function testMethod(){
		alert(test);
 	} 	
</script>
<style type="text/css">
<!--
body {
	background-image: url(images/loginBackPic.jpg);
	background-repeat: no-repeat;
}
-->
</style></head>
<body>
<table width="100%" border="0">
  <tr>
    <td width="24%"><img width="175" height="629" src="images\login.png" alt="欢  迎  使  用  号  簿  管  家"></td>
    <td width="7%">&nbsp;</td>
    <td width="69%"><form action="login" method="post" >
  <table width="468" border="1" cellspacing="0" bordercolor="#3333FF">
    <tr>
      <td width="95" height="40" align="right">用户名：</td>
      <td width="176" height="40" align="left"><input type="text" name="user.userName" id="userName" onKeyUp="checkname()"></td>
      <td width="175" height="40" align="center"><font size="2" color="red" id="error1">&nbsp;<%=error1 %></font></td>
    </tr>
    <tr>
      <td height="40" align="right">密码：</td>
      <td height="40" align="left"><input type="password" name="user.password" id="password" onKeyUp="checkpassword()"></td>
      <td height="40" align="center"><font size="2" color="red" id="error2">&nbsp;<%=error2 %></font></td>
    </tr>
    <tr>
      <td height="40" align="right">验证码：</td>
      <td height="40" align="left"><input type="text" id="checkcode" onKeyUp="check()"/></td>
      <td height="40" align="center"><font size="2" id="error3" color="#808080">请输入验证码</font></td>
    </tr>
    <tr>
      <td height="40">&nbsp;</td>
      <td height="40" align="left"><img src="code.jsp" name="pic" border=1 id="pic" /><a href="javaScript:reloadImage();">刷新验证码</a></td>
      <td height="40" align="center"><a href="regist.html?TB_iframe=true&height=550&width=600" title="欢迎注册号簿管家" class="thickbox">注册</a></td>
    </tr>
    <tr>
      <td height="40">&nbsp;</td>
      <td height="40" align="left"><input type="submit" value="登录" id="submit" disabled="true"/></td>
      <td height="40" align="center">&nbsp;</td>
    </tr>
  </table>
        </form></td>
  </tr>
</table>
</body>
</html>